<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>testhttp</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

</head>
<body>
<div style="margin-left: 60px">
    <br/>
    <button onclick="getAxios()">axiosGet</button>
    <br/>
    <br/>
    <button onclick="postAxios()">axiosPost</button>
    <br/>
    <br/>
<!--    <input class="upload" type="file" id="imgfile"  accept="image/jpeg,image/jpg,image/png" @change="uploadImg1($event)">-->
    <input class="upload" type="file" id="imgfile"  accept="image/jpeg,image/jpg,image/png" onchange="uploadImg()">

    <br/>
    <br/>
    <button onclick="upload()">文件上传</button>
    <br/>
    <br/>

    <input type="text" id="textfield" /><br/>
    <a class="a-upload">
        <input type="file" name="file" id="fileField" onchange="document.getElementById('textfield').value=document.getElementById('fileField').value">点击这里上传文件
    </a>

    <a class="file">选择文件
        <input type="file" name="file" id="fileField1" onchange="document.getElementById('textfield').value=document.getElementById('fileField1').value">
    </a>
</div>
<script>

    // https://zhuanlan.zhihu.com/p/103706703
    //全局的 axios 默认值
    // axios.defaults.baseURL = 'https://api.example.com';
    // axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
    // axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';


    //自定义实例默认值
    // Set config defaults when creating the instance
    const instance = axios.create({
        baseURL: 'http://127.0.0.1:8092/req'
    });
    //
    // // Alter defaults after instance has been created
    // instance.defaults.headers.common['Authorization'] = AUTH_TOKEN; instan

    function getAxios() {

        instance.get('/login?name=xlb&pwd=123').then(function (response) {

            // console.log(response);

            console.log(response.data);
        }).catch(function (error) {
            console.log(error);
        })
    }

    function postAxios() {

        instance.post('/r',{name:'xlb',pwd:'123'}).then(function (response) {

            console.log(response);
        }).catch(function (err) {

            console.log(err);
        })
    }


    const instanceUpFile = axios.create({
        baseURL: 'http://127.0.0.1:8092/req',
        timeout:2000,
        headers:{'Content-Type': 'multipart/form-data'}
    });


    var formdata = null;

    function upload() {

        console.log('upload');

        instanceUpFile.post('/upImg',formdata).then(function (response) {

            console.log(response);
        }).catch(function (err) {

            console.log(err);
        })
    }

    function uploadImg() {

        console.log('uploadImg');

        // // 获取file
        let file = document.getElementById('imgfile').files[0];
        // // 实例化
        formdata = new FormData();

        formdata.append('file', file);

        let json =  {name:"xlb",pwd:"123"};

        formdata.append('user', JSON.stringify(json));

        formdata.set('param2','val2');

        // formdata.append('user', json);

    }

</script>



</body>
</html>
